<template>
  <div class="login">
    <div class="login__container">
      <h2 class="header centered">欢迎使用 Gitee Helper</h2>
      <div class="login__how-use">
        <p>如何使用？</p>
        <p>1. 登录 Gitee</p>
        <p>2. 进入私人令牌页面 https://gitee.com/personal_access_tokens</p>
        <p>3. 生成私人令牌（ps: 为保护隐私，仅授权获取个人信息即可）</p>
      </div>

      <div class="login__token-field">
        <el-input placeholder="请输入私人令牌" v-model="form.secretToken" show-password></el-input>
      </div>

      <div class="login__submit-button">
        <el-button type="primary" plain @click="onSubmit">开始使用</el-button>
      </div>
    </div>
  </div>
</template>
<script>
import { ipcRenderer } from 'electron'
export default {
  name: 'login',
  data () {
    return {
      form: {
        secretToken: ''
      }
    }
  },
  methods: {
    verify () {
      if (this.form.secretToken) {
        return true
      }
      this.$message.error('请到填入私人令牌')
    },
    async onSubmit () {
      if (this.verify()) {
        this.$store.dispatch('user/login', this.form)
      }
    },
    onQuick () {
      window.top.close()
      ipcRenderer.send('quit')
    }
  }
}
</script>
